import { onMounted, onUnmounted, ref } from "vue";

export default function useMousePosition() {
    // 初始化坐标
    const x = ref(0);
    const y = ref(0);

    // 挂载后绑定鼠标点击监听
    onMounted(() => {
        window.addEventListener('click', getPosition);
    })

    // 页面销毁前解绑点击监听
    onUnmounted(() => {
        window.addEventListener('click', getPosition);
    })

    // 获取点击鼠标的坐标函数
    const getPosition = (e: MouseEvent) => {
        x.value = e.pageX;
        y.value = e.pageY;
    }

    return { x, y };
}